@mixin motion-common() {
    animation-duration: $animation-time;
    animation-fill-mode: both;
}

@mixin make-motion($className, $keyframeName) {
    .#{$className}-enter-active,
    .#{$className}-appear {
        @include motion-common();
        animation-play-state: paused;
    }
    .#{$className}-leave-active {
        @include motion-common();
        animation-play-state: paused;
    }
    .#{$className}-enter-active,
    .#{$className}-appear {
        animation-name: #{$keyframeName}In;
        animation-play-state: running;
    }
    .#{$className}-leave-active {
        animation-name: #{$keyframeName}Out;
        animation-play-state: running;
    }
}
@import 'fade';
@import 'slide';
@import 'move';
@import 'ease';
@import 'zoom';
